$(document).ready(function(){
	setLogoPosition();
	overlayMyGroup();
	overlayInstruction();
	overlayContact();
	overlayService();
	//$('#scrollbar1').tinyscrollbar();
	$('#vtab').Tabs({'direction' : 'vertical'});
});

function setLogoPosition(){
	$('#logoWrapper').css('left', ($(document).width() / 2) - ($('#logoWrapper').width() / 2));
	$('#logoWrapper').css('top', (768 / 2) - ($('#logoWrapper').height() / 2));	
}

function overlayMyGroup(){
	$("#myGroupIcon").overlay({
		mask: '#1d535e',
		left: ($(document).width() / 2) - ($('#myGroupContent').width() / 2),
		closeOnClick: false,
		closeOnEsc: true
	});
}

function overlayInstruction(){
	$("#instroductionIcon").overlay({
		mask: '#1d535e',
		left: ($(document).width() / 2) - ($('#instroductionContent').width() / 2),
		closeOnClick: false,
		closeOnEsc: true
	});
}

function overlayService(){
	$("#serviceIcon").overlay({
		mask: '#1d535e',
		left: ($(document).width() / 2) - ($('#serviceContent').width() / 2),
		top: 30,
		closeOnClick: false,
		closeOnEsc: true
	});
}

function overlayContact(){
	$("#contactIcon").overlay({
		mask: '#1d535e',
		left: ($(document).width() / 2) - ($('#contactContent').width() / 2),
		closeOnClick: false,
		closeOnEsc: true
	});
}

function getLeftPosition(id){
	return $('#' + id + '').offset().left;
}

function getTopPosition(id){
	return $('#' + id + '').offset().top;
}

function getWidth(id){
	return $('#' + id + '').width();
}

function overlay(){
	// create custom animation algorithm for jQuery called "drop" 
	$.easing.drop = function (x, t, b, c, d) {
		return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
	};

	// loading animation
	$.tools.overlay.addEffect("drop", function(css, done) { 
	   
	   // use Overlay API to gain access to crucial elements
	   var conf = this.getConf(),
		   overlay = this.getOverlay();           
	    
	   // determine initial position for the overlay
	   if (conf.fixed)  {
		  css.position = 'fixed';
	   } else {
		  css.top += $(window).scrollTop();
		  css.left += $(window).scrollLeft();
		  css.position = 'absolute';
	   } 
	   
	   // position the overlay and show it
	   overlay.css(css).show();

	   // begin animating with our custom easing
	   overlay.animate({ top: '+=55',  opacity: 2,  width: '+=20'}, 200, 'drop', done);
	   
	   /* closing animation */
	   }, function(done) {
		  this.getOverlay().animate({top:'-=55', opacity:0, width:'-=20'}, 100, 'drop', function() {
			 $(this).hide();
			 done.call();
		  });
	   }
	);	
}